<template>
	<div class="h100">
		<div v-if="itemForm" class="h100">
			<div class="title-box">
				<span>
					任务详情
				</span>
				<div v-if="itemForm">
					<el-button type="danger" icon="el-icon-close" circle @click="close" />
				</div>
			</div>
			<div class="center-box flex-c flex-sb">
				<el-descriptions title="基础信息" :column="4" border size="medium">
					<el-descriptions-item label="节点类型">{{form.taskBackup3}}</el-descriptions-item>
					<el-descriptions-item label="节点名称">{{form.taskName}}</el-descriptions-item>
					<el-descriptions-item label="节点描述">{{form.taskRemark}}</el-descriptions-item>
					<el-descriptions-item label="节点天数">{{form.taskBackup2}}</el-descriptions-item>
					<el-descriptions-item label="开始时间">{{form.startTime}}</el-descriptions-item>
					<el-descriptions-item label="结束时间">{{form.endTime}}</el-descriptions-item>
					<el-descriptions-item label="备注">{{form.taskDesc}}</el-descriptions-item>
				</el-descriptions>
				<el-divider />
				<div style="display: flex; flex-direction: row;justify-content: space-between;flex: 1;">
					<div style="width: 100%;" class="h100">
						<div class="title-box">
							<span>
								填报要求
							</span>
							<div>
								<el-button type="success" icon="el-icon-view" @click="openMylog"
									size="mini">评分项</el-button>
							</div>
						</div>
						<div class="center-box">
							<el-table ref="table" v-loading="yaoqiuLoading" :data="yaoqiuList">
								<el-table-column type="expand">
									<template slot-scope="props">
										<el-form label-position="top" inline style="margin-left: 80px;">
											<el-form-item label="填报描述">
												<span>{{ props.row.nodeRemark }}</span>
											</el-form-item>
										</el-form>
									</template>
								</el-table-column>
								<el-table-column label="填报名称" align="left" prop="nodeName"
									show-overflow-tooltip></el-table-column>
								<el-table-column label="填报状态" align="left" width="100" prop="nodeStatus">
									<template slot-scope="scope">
										<span>{{ getNodeStatus(form.guanlian.taskStatus) }}</span>
									</template>
								</el-table-column>
								<!-- <el-table-column label="填报描述" align="center" prop="nodeRemark" show-overflow-tooltip></el-table-column> -->
								<el-table-column label="操作" align="center" width="200">
									<template slot-scope="scope">
										<!-- <el-button size="mini" type="primary" v-hasPermi="['lanjing:template:edit']"
											icon="el-icon-view" @click="yaoqiuFun('detail',scope.row,scope.$index)"
											v-if="!btnShow">详情</el-button> -->
										<el-button size="mini" type="success" icon="el-icon-edit"
											@click="yaoqiuFun('tianbao',scope.row,scope.$index)"
											v-if="form.guanlian.taskStatus <= 1 || form.guanlian.taskStatus == 3">填报</el-button>
										<el-button size="mini" type="warning" 
											icon="el-icon-chat-line-square"
											@click="yaoqiuFun('shenpi',scope.row,scope.$index)"
											v-if="!btnShow">审批</el-button>
									</template>
								</el-table-column>
							</el-table>
						</div>
					</div>

				</div>
			</div>
		</div>
		<el-empty class="h100" v-else description="任务详情" />

		<renwu ref="renwu" @ok="(row)=>{yaoqiuFun('ok',row)}"></renwu>
		<pingfen ref="pingfen" @ok="(row)=>{pingfenFun('ok',row)}"></pingfen>

		<mylog ref="mylog" @ok="updataParentId" @close="cancel">
			<template #center>
				<el-table ref="table" v-loading="pingfenLoading" :data="pingfenList">
					<el-table-column label="评分项名称" align="center" prop="pfName" />
					<el-table-column label="占分标准(每次)" align="center" prop="pfNumber" />
					<el-table-column label="减分标准(每次)" align="center" prop="pfJianNumber" />
					<!-- <el-table-column label="评估责任单位" align="center" prop="pfDept" />
							<el-table-column label="评分描述" align="center" prop="remark" /> -->
					<el-table-column label="操作" align="center" width="120">
						<template slot-scope="scope">
							<el-button size="mini" type="primary" v-hasPermi="['lanjing:template:edit']"
								:icon="scope.row.edit?'el-icon-check':'el-icon-edit'"
								@click="pingfenFun('edit',scope.row,scope.$index)" v-if="btnShow"></el-button>
							<el-button size="mini" type="danger" v-hasPermi="['lanjing:template:edit']"
								icon="el-icon-delete" @click="pingfenFun('remove',scope.row,scope.$index)"
								v-if="btnShow"></el-button>
							<el-button size="mini" type="primary" v-hasPermi="['lanjing:template:edit']"
								icon="el-icon-view" @click="pingfenFun('detail',scope.row,scope.$index)"
								v-if="!btnShow"></el-button>
						</template>
					</el-table-column>
				</el-table>
			</template>
		</mylog>
		<mylog ref="tianbaoLog" @ok="fankuiOk" @close="cancel">
			<template #center>
				<notice ref="notice"></notice>
			</template>
		</mylog>
		<mylog ref="shenpiLog" @close="cancel">
			<template #center>
				<comment ref="comment"></comment>
			</template>
		</mylog>
	</div>
</template>

<script>
	import {
		getAction,
		postAction,
		editAction,
		removeAction,
		detailAction,
	} from "@/api/api";
	import mylog from '@/views/components/mylog.vue'
	import myDrawer from '@/views/components/myDrawer.vue'
	import renwu from '@/views/lanjing/template/renwu.vue';
	import pingfen from '@/views/lanjing/template/pingfenxiang.vue';
	import dayjs from "dayjs";
	import notice from './notice.vue';
	import comment from './comment.vue';
	import fankuiApi from '@/api/fankui';
	import shenheApi from '@/api/shenhe';
	import taskDeptApi from '@/api/taskdept';



	export default {
		dicts: [],
		components: {
			mylog,
			myDrawer,
			renwu,
			pingfen,
			notice,
			comment
		},
		name: "formItem",
		props: {
			btnShow: {
				default: true,
			}
		},
		watch: {
			btnShow(a) {
				this.btnShow = a
			}
		},
		data() {
			return {
				spanNumber: 6,
				form: {},
				rules: {
					nodeName: [{
						required: true,
						message: '请输入节点名称',
						trigger: 'blur'
					}],
					nodeRemark: [{
						required: true,
						message: '请输入节点描述',
						trigger: 'blur'
					}],
					nodeDay: [{
						required: true,
						message: '请输入节点天数',
						trigger: 'blur'
					}],
					nodeNumber: [{
						required: true,
						message: '请输入节点分数',
						trigger: 'blur'
					}],
					remark: [{
						required: true,
						message: '请输入节点备注',
						trigger: 'blur'
					}],
					nodeQianzhi: [{
						required: true,
						message: '请选择前置节点',
						trigger: 'charge'
					}],
					startTime: [{
						required: true,
						message: '请选择开始时间',
						trigger: 'charge'
					}],
				},
				loading: false,
				itemForm: null,
				pingfenList: [],
				pingfenLoading: false,
				pingfenDis: false,
				yaoqiuList: [],
				yaoqiuLoading: false,
				yaoqiuDis: false,
				qianzhi: [],
				modelTime: null,
				modelList: [],
				tbItem: {},

			};
		},
		created() {},
		methods: {
			openMylog() {
				this.$refs.mylog.open = true;
				this.$refs.mylog.title = '评分项';
				this.$refs.mylog.showBtn = false

			},
			show(row = null) {
				console.log('formItem', row)
				if (row) {
					this.itemForm = {
						...row
					}
					this.form = {
						...row
					}
					this.pingfenList = JSON.parse(row.temaplateFankui)
					this.yaoqiuList = JSON.parse(row.temaplatePingfen)
				} else {
					let id = new Date().getTime()
					this.itemForm = {
						id,
						ids: [id]
					}
					this.pingfenList = []
					this.yaoqiuList = []
				}
			},
			ok() {
				this.$refs.form.validate((valid) => {
					if (valid) {
						let obj = {
							...this.itemForm,
							...this.form,
							pingfenList: this.pingfenList,
							yaoqiuList: this.yaoqiuList
						}
						this.$emit('ok', obj)
					}
				});
			},
			close() {
				this.itemForm = null;
				this.pingfenList = [];
				this.$emit('close')
			},
			yaoqiuFun(type, row, index) {
				console.log(type, row)

				if (type == 'detail') {
					this.$refs.renwu.$refs.mylog.open = true;
					this.$refs.renwu.$refs.mylog.title = '查看任务';
					if (!this.btnShow) {
						this.$refs.renwu.$refs.mylog.showBtn = false;
						this.$refs.renwu.showBtn = true;
					}
					this.$refs.renwu.form = {
						...row,
						index: index
					}
				}
				if (type == 'tianbao') {
					this.$refs.tianbaoLog.open = true;
					this.$refs.tianbaoLog.title = '填报内容';
					this.tbItem = {
						...row
					}
					if(this.form.guanlian.taskStatus <=1 || this.form.guanlian.taskStatus == 3){
						this.$refs.tianbaoLog.showBtn = true
					}else{
						this.$refs.tianbaoLog.showBtn = false
						this.$refs.tianbaoLog.disType = true
						
					}
					if (this.form.guanlian.taskStatus != 0) {
						console.log(fankuiApi.getAll())
						fankuiApi.getModelPagination({
							page: 1,
							rowsPerPage: -1
						}, null, {
							taskId: this.itemForm.taskId,
							fankuiBackup1: this.itemForm.guanlian.id,
						}).then(res => {
							console.log(res)
							if (res.code == 200 && res.data.list) {
								let list = res.data.list
								this.$nextTick(() => {
									this.$refs.notice.$refs.myFileUpload.filePath =
										`/${this.itemForm.guanlian.roundId}/${this.itemForm.guanlian.taskId}`
									this.$refs.notice.$refs.myFileUpload.fileListHttp = list[list.length -
										1].fankuiFile
									this.$refs.notice.form = {
										...list,
										fankuiContent: list[list.length - 1].fankuiContent,
										fankuiFile: list[list.length - 1].fankuiFile
									}
								})
							}
						})
					}

				}
				if (type == 'shenpi') {
					this.$refs.shenpiLog.open = true;
					this.$refs.shenpiLog.title = '审批内容';
					this.$refs.shenpiLog.showBtn = false
					this.tbItem = {
						...row
					}
					console.log(fankuiApi.getAll())
						fankuiApi.getModelPagination({
							page: 1,
							rowsPerPage: -1
						}, null, {
							taskId: this.itemForm.taskId,
							fankuiBackup1: this.itemForm.guanlian.id,
						}).then(fankui => {
							let fankuiList = fankui.data.list
							console.log("type == 'shenpi'",fankuiList)
							shenheApi.getModelPagination({
								page: 1,
								rowsPerPage: -1
							}, null, {
								taskId: this.itemForm.taskId,
								fankuiBackup1: this.itemForm.guanlian.id,
							}).then(shenhe => {
								console.log("type == 'shenpi'",shenheList)
								let shenheList = shenhe.data.list || []
								fankuiList = fankuiList.map(v => {
									let obj = {
										...v,
										shenhe: shenheList.find(d => d.fankuiBackup2 == v.id) || {}
									}
									return obj

								})
								this.$refs.comment.activities = fankuiList
							})
						})
				}

			},
			pingfenFun(type, row, index) {
				console.log(type, row)
				if (type == 'ok') {
					if (row.edit == undefined) {
						let obj = {
							...row
						}
						obj.edit = false;
						this.pingfenList.push(obj)
					} else {
						this.$set(this.pingfenList, row.index, {
							...row
						})
					}
					return
				}
				if (type == 'add') {
					this.$refs.pingfen.$refs.mylog.open = true;
					this.$refs.pingfen.$refs.mylog.title = '添加评分项';
				}
				if (type == 'edit') {
					this.$refs.pingfen.$refs.mylog.open = true;
					this.$refs.pingfen.$refs.mylog.title = '编辑评分项';
					this.$refs.pingfen.form = {
						...row,
						index: index
					}
				}
				if (type == 'detail') {
					this.$refs.pingfen.$refs.mylog.open = true;
					this.$refs.pingfen.$refs.mylog.title = '查看评分项';

					if (!this.btnShow) {
						this.$refs.pingfen.$refs.mylog.showBtn = false;
						this.$refs.pingfen.showBtn = true;
					}
					this.$refs.pingfen.form = {
						...row,
						index: index
					}
				}
				if (type == 'remove') {
					this.$confirm('此操作将永久删除该评分项, 是否继续?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						this.pingfenList.splice(index, 1)
						this.$message({
							type: 'success',
							message: '删除成功!'
						});
					})
				}
			},
			setStartTime() {
				let endTime = dayjs(this.form.startTime, "YYYY-MM-DD").add(this.form.nodeDay, 'day').format("YYYY-MM-DD")
				this.$set(this.form, 'endTime', endTime)
			},
			setDay() {
				if (this.modelTime) {
					if (this.form.nodeQianzhi.length > 0 && this.form.nodeDay) {
						let startTime = null,
							endTime = null,
							obj = {};
						console.log(this.form.nodeQianzhi)
						if (this.form.nodeQianzhi[this.form.nodeQianzhi.length - 1] == 'root') {
							startTime = this.modelTime
						} else {
							obj = this.modelList.find(v => v.id == this.form.nodeQianzhi[this.form.nodeQianzhi.length - 1])
							startTime = dayjs(obj.endTime, "YYYY-MM-DD").add(1, 'day').format("YYYY-MM-DD")
						}
						endTime = dayjs(startTime, "YYYY-MM-DD").add(this.form.nodeDay, 'day').format("YYYY-MM-DD")
						this.$set(this.form, 'startTime', startTime)
						this.$set(this.form, 'endTime', endTime)
					}
				}
			},
			setModelData(modelTime, modelList) {
				this.modelTime = modelTime
				this.modelList = modelList
			},
			updataParentId() {
				this.$refs.tianbaoLog.open = false;
				this.$refs.shenpiLog.open = false;
			},
			fankuiOk() {
				console.log('fankuiOk', this.tbItem)
				let obj = {
					fankuiContent: this.$refs.notice.form.fankuiContent,
					fankuiFile: this.$refs.notice.form.fankuiFile,
					fankuiTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
					taskId: this.itemForm.taskId,
					fankuiBackup1: this.itemForm.guanlian.id,
					id: this.$refs.notice.form.id || new Date().getTime()
				}
				console.log(obj)
				if (obj.fankuiContent || obj.fankuiFile.length > 0) {
					if (this.$refs.notice.form.id) {
						obj.id = this.$refs.notice.form.id
						fankuiApi.putModelById(obj.id, obj).then(res => {
							if (res.code == 200) {
								this.$message.success('编辑填报成功')
								this.$refs.tianbaoLog.loading = false;
								this.$refs.tianbaoLog.open = false;
								this.tbItem = null
							}
						}).catch(err => {
							console.log(err)
							this.$refs.tianbaoLog.loading = false;
							this.$message.error('编辑填报失败')
						})
					} else {
						console.log(obj)
						//调取方法
						fankuiApi.postOrPutModel(obj).then(res => {
							if (res.code == 200) {
								taskDeptApi.putModelById(this.itemForm.guanlian.id, {
									taskStatus: 1,
									temaplateBackup4:dayjs().format('YYYY-MM-DD HH:mm:ss')
								}).then(res => {
									this.$message.success('新增填报成功')
									this.$refs.tianbaoLog.loading = false;
									this.$refs.tianbaoLog.open = false;
									this.tbItem = null
								}).catch(err => {
									console.log(err)
									this.$refs.tianbaoLog.loading = false;
									this.$message.error('新增填报失败')
								})
							}
						}).catch(err => {
							console.log(err)
							this.$refs.tianbaoLog.loading = false;
							this.$message.error('新增填报失败')
						})
					}
				} else {
					this.$message.warning('附件或内容不能为空')
					this.$refs.tianbaoLog.loading = false;
				}
			},
			getNodeStatus(e) {
				if (e) {
					if (e == 1) {
						return '已反馈'
					}
					if (e == 2) {
						return '已反馈'
					}
				} else {
					return '待反馈'
				}
			},
			cancel(){
				
			}
		}
	};
</script>
<style scoped lang="scss">
	.title-box {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30px;

		>span {
			font-weight: 500;
			font-size: 18px;
			line-height: 30px;
		}

	}

	.center-box {
		overflow-x: hidden;
		height: calc(100% - 60px);
	}
</style>